<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>待办任务</title>
		<!-- 引入样式 -->
		<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
		<script src="../js/vue.js"></script>
		<!-- 引入组件库 -->
		<script src="https://unpkg.com/element-ui/lib/index.js"></script>
		<script src="../js/axios.js"></script>
		<script src="../js/qs.js"></script>
		<script src="../js/jquery.min.js"></script>
	</head>
	<body>
		<br />
		<div id="bigbox">
			<div style="width: 100%;margin-left: 15px;display: block;" id="app1">
				<i class="el-icon-caret-right" style="line-height: 40px;margin-right: 5px; float: left;"></i>
				<template style="margin-top: 50px;">
					<el-select v-model="alltaskinfor" @change="getSelectInfo()" filterable clearable placeholder="全部数据" style="float: left;width: 180px; height: 60px;">
							<el-option v-for="item in alltaskoptions" :key="item.value" :label="item.label" :value="item.value">
							</el-option>
					</el-select>
				</template>
				<i class="el-icon-search" style="line-height: 40px;float: left;margin-left: 10px; width: 50px; height: 50px;"></i>
				<!-- 搜索框 -->
				<div style="display: block;margin-left: -20px;float: left;">
					<el-input style="width: 200px;" placeholder="" v-model="tasktheme">
						<el-button slot="append"  @click="searchTheme()" style="width: 100px;">任务主题</el-button>
					</el-input>
				</div>
			</div>

			<!-- 统计 -->
			<div style="width: 100%;float: left;" id="app2">
				<div style="float: left;margin-left: 30px;">
					<p style="font-size: 13px;color: #333333;height: 30px;">待办任务<!-- <a style="font-size: 12px;color: #807E7E;">&nbsp;共${page.total}条</a> --></p>
				</div>
				<div style="float: right;display: block;margin-right: 20px;margin-top: -10px;">
					<!-- 新建待办任务 -->
					<el-button size="small" icon="el-icon-circle-plus" @click="getNew()" style="width: 80px;">&nbsp;新建</el-button>
					<!-- 遮罩层 -->
					<el-dialog title="待办任务" :visible.sync="dialogFormVisible" width="70%">
						<hr style="border: 0.5px solid #807E7E;margin: -15px 0px 15px;" />
						<el-form :model="taskform" :rules="taskrules" ref="taskform" label-width="100px" class="demo-taskform" style="height: 430px; margin-top: 35px;">
							<el-row style="margin-left: 20px;margin-bottom: 10px;">
								<el-col :span="22">
									<el-form-item label="描述" prop="description" required>
										<el-input type="textarea" autosize placeholder="" v-model="taskform.description" style="width: 100%;"></el-input>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row style="margin-left: 20px; margin-bottom: 10px;">
								<el-col :span="22">
									<el-form-item label="客户">
										<el-select v-model="taskform.custID"  @clear="comcustidto()" @change="selectOnechange()" clearable filterable="" style="width: 100%;" remote="" reserve-keyword placeholder="请输入关键词" :remote-method="cumremoteMethod" :loading="cumloading">
										<i slot="prefix" class="el-input__icon el-icon-search"></i>
										<el-option v-for="item in customer" :key="item.value" :label="item.label" :value="item.value"></el-option>
								 </el-select>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row style="margin-left: 20px;margin-bottom: 10px;">
								<el-col :span="10">
									<el-form-item label="联系人" style="width:92%;">
										<el-select v-model="taskform.contID" clearable style="width: 100%;"
										 remote="" reserve-keyword placeholder="请选择" :remote-method="comtaskcontactidMethod" :loading="cumloading">
											<i slot="prefix" class="el-input__icon el-icon-search"></i>
											<el-option v-for="item in alltaskcontactid" :key="item.value" :label="item.label" :value="item.value"></el-option>
										</el-select>
									</el-form-item>
								</el-col>
								<el-col :span="12">
									<el-form-item label="维修单" :label-width="formLabelWidth" prop="repairID" required>
										 <el-select v-model="taskform.repairID" clearable style="width: 100%;"
										 remote="" reserve-keyword placeholder="请选择" :remote-method="comrepairIDMethod" :loading="cumloading">
											<i slot="prefix" class="el-input__icon el-icon-search"></i>
											<el-option v-for="item in alltaskrepairID" :key="item.value" :label="item.label" :value="item.value"></el-option>
										</el-select>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row style="margin-left: 20px;margin-bottom: 10px;">
								<el-col :span="10">
									<el-form-item label="类型">
											<el-select v-model="taskform.taskclassity" clearable style="width: 90%;"
											 remote="" reserve-keyword placeholder="客户关怀" disabled :remote-method="taskclassifyMethod" :loading="cumloading">
												<i slot="prefix" class="el-input__icon el-icon-search"></i>
												<el-option v-for="item in tclassify" :key="item.value" :label="item.label" :value="item.value"></el-option>
											</el-select>
											<!-- <el-tooltip content="Bottom center" placement="bottom">
												<div slot="content">数据字典</div>
												<i class="el-icon-document" id="newtoolone"></i>
											</el-tooltip> -->
									</el-form-item>
								</el-col>
								<el-col :span="12">
									<el-form-item label="日期" :label-width="formLabelWidth">
										<el-date-picker type="date" placeholder="选择日期" v-model="taskform.taskdate" value-format="yyyy-MM-dd" style="width: 100%;" :picker-options="pickerOptions" ></el-date-picker>
									</el-form-item>
								</el-col>
							</el-row>
							<el-row style="margin-left: 20px;margin-bottom: 10px;">
								<el-col :span="22">
										<el-form-item label="执行人">
											<el-select v-model="taskform.doname" clearable filterable="" style="width: 100%;" remote="" reserve-keyword placeholder="请输入关键词" :remote-method="domannameMethod" :loading="cumloading">
												<i slot="prefix" class="el-input__icon el-icon-search"></i>
												<el-option v-for="item in domanname" :key="item.value" :label="item.label" :value="item.value"></el-option>
											</el-select>
										</el-form-item>
								</el-col>
							</el-row>
							<el-form-item style="float: right;margin-top: 40px;">
								<el-button @click="dialogFormVisible = false">取 消</el-button>
								<el-button type="primary" @click="submitForm('taskform')">确定</el-button>
								<el-button @click="resetForm('taskform')">重置</el-button>
							</el-form-item>
						</el-form>
					</el-dialog>

				</div>
			</div>

			<!-- 表单 -->
			<div id="app3" style="margin-left: 10px;">
				<template>
					<el-table border ref="multipleTable" tooltip-effect="dark" @selection-change="handleSelectionChange" :data="tasktable"
					 border style="width: 100%;color: black;">
						<el-table-column type="selection" width="35" align="center"></el-table-column>
						<el-table-column prop="ID" label="ID" width="80" align="center"></el-table-column>
						<el-table-column prop="description" show-overflow-tooltip label="主题" align="center"></el-table-column>
						<el-table-column prop="taskstatue" label="状态" align="center"></el-table-column>
						<el-table-column prop="taskpriority" label="优先级" align="center"></el-table-column>
						<el-table-column prop="custname" label="顾客" align="center"></el-table-column>
						<el-table-column prop="taskdate" label="开始日期" align="center"></el-table-column>
						<el-table-column prop="taskdoman" label="执行人" align="center"></el-table-column>
						<el-table-column fixed="right" label="操作" width="100" align="center">
							<template slot-scope="scope">
								<el-tooltip content="Bottom center" placement="bottom">
									<div slot="content">删除</div>
									<i class="el-icon-delete" @click="deletenew(scope.row.ID)" style="margin: 0px 10px;font-size: 17px;"></i>
								</el-tooltip>
								<el-tooltip content="Bottom center" placement="bottom">
									<div slot="content">编辑</div>
									<i class="el-icon-edit" @click="updatehandleClick(scope.row)" style="font-size: 17px;"></i>
								</el-tooltip>
								<el-dialog title="提示" :visible.sync="dialogDelete" width="30%" append-to-body >
					 	 			<span>你确定要删除吗？</span>
						  				<span slot="footer" class="dialog-footer">
						   				<el-button @click="dialogDelete = false">取 消</el-button>
						   				<el-button type="primary" @click="dialogDelete = false" v-on:click="Delete" >确 定</el-button>
					 				</span>
								</el-dialog>
								
								<!-- 查看待办任务 -->
								<div id="repairform" style="width: 90px;display: block; float: left;margin-left: 15px;">
									<!-- Form -->
									<!-- 遮罩层 -->
									<el-dialog title="待办任务" :visible.sync="dialogFormVisible" width="70%" append-to-body>
										<hr style="border: 0.5px solid #807E7E;margin: -15px 0px 15px;" />
										<el-form :model="taskform" :rules="taskrules" ref="taskform" label-width="100px" class="demo-taskform" style="height: 580px; margin-top: 35px;">
											<el-row style="margin-left: 20px;margin-bottom: 10px;">
												<el-col :span="22">
													<el-form-item label="描述" prop="description" required>
														<el-input type="textarea" autosize placeholder="" v-model="taskform.description" style="width: 100%;"></el-input>
													</el-form-item>
												</el-col>
											</el-row>
											<el-row style="margin-left: 20px;margin-bottom: 10px;">
												<el-col :span="22">
													<el-form-item label="执行人">
														<el-select v-model="taskform.doname" clearable filterable="" style="width: 100%;" remote="" reserve-keyword placeholder="请选择" :remote-method="domannameMethod" :loading="cumloading">
															<i slot="prefix" class="el-input__icon el-icon-search"></i>
															<el-option v-for="item in domanname" :key="item.value" :label="item.label" :value="item.value"></el-option>
														</el-select>
													</el-form-item>
												</el-col>
											</el-row>
											<el-row style="margin-left: 20px;margin-bottom: 10px;">
												<el-col :span="10">
													<el-form-item label="完成期限" >
														<el-date-picker type="date" placeholder="选择日期" value-format="yyyy-MM-dd" v-model="taskform.taskdate" style="width: 100%;"></el-date-picker>
													</el-form-item>
												</el-col>
												<el-col :span="11">
													<el-form-item label="时间" prop="tasktime" style="margin-left: 10%;width:99%">
														<el-time-picker type="fixed-time" placeholder="选择时间" v-model="taskform.tasktime" style="width: 100%;" value-format="HH:mm:dd"></el-time-picker >
													</el-form-item>
												</el-col>
											</el-row>
											<el-row style="margin-left: 20px; margin-bottom: 10px;">
												<el-col :span="22">
													<el-form-item label="客户">
														<el-select v-model="taskform.custID"  @clear="comcustidto()" @change="selectOnechange()" clearable filterable="" style="width: 100%;" remote="" reserve-keyword placeholder="请输入关键词" :remote-method="cumremoteMethod" :loading="cumloading">
															<i slot="prefix" class="el-input__icon el-icon-search"></i>
															<el-option v-for="item in customer" :key="item.value" :label="item.label" :value="item.value"></el-option>
													</el-form-item>
												</el-col>
											</el-row>
											<el-row style="margin-left: 20px;margin-bottom: 10px;">
												<el-col :span="10">
													<el-form-item label="联系人" style="width:100%;">
														<el-select v-model="taskform.contID" clearable style="width: 100%;"
														 remote="" reserve-keyword placeholder="请选择" :remote-method="comtaskcontactidMethod" :loading="cumloading">
															<i slot="prefix" class="el-input__icon el-icon-search"></i>
															<el-option v-for="item in alltaskcontactid" :key="item.value" :label="item.label" :value="item.value"></el-option>
														</el-select>
													</el-form-item>
												</el-col>
												<el-col :span="12">
													<el-form-item label="状态" prop="status" style="margin-left: 9%;width:100%">
														<template>
															<el-radio v-model="taskform.status" :label="1427">已结束</el-radio>
															<el-radio v-model="taskform.status" :label="1428">未结束</el-radio>
															<el-radio v-model="taskform.status" :label="1429">取消</el-radio>
														</template>
													</el-form-item>
												</el-col>
											</el-row>
											<el-row style="margin-left: 20px;margin-bottom: 10px;">
												<el-col :span="10">
													<el-form-item label="创建时间">
														<el-date-picker disabled type="date" value-format="yyyy-MM-dd" placeholder="" v-model="taskform.createdate" style="width: 100%;"></el-date-picker>
													</el-form-item>
												</el-col>
												<el-col :span="11">
													<el-form-item label="优先级"  prop="priority" style="margin-left: 10%; width:100%">
														<template>
															<el-radio v-model="taskform.priority" :label="1361">高</el-radio>
															<el-radio v-model="taskform.priority" :label="1362">低</el-radio>
														</template>
													</el-form-item>
												</el-col>
											</el-row>
											<el-row style="margin-left: 20px;margin-bottom: 10px;">
												<el-col :span="22">
														<el-form-item label="创建人">
															<el-select v-model="taskform.createMan" disabled clearable filterable="" style="width: 100%;" remote="" reserve-keyword  :remote-method="createManMethod" :loading="cumloading">
																<i slot="prefix" class="el-input__icon el-icon-search"></i>
															<el-option v-for="item in allcreateMan" :key="item.value" :label="item.label" :value="item.value"></el-option>
														</el-select>
													</el-form-item>
												</el-col>
											</el-row>
											
											<el-form-item style="float: right;margin-top: 30px;">
												<el-button @click="dialogFormVisible = false">取 消</el-button>
												<el-button type="primary" @click="submitForm('taskform')">确定</el-button>
												<el-button @click="resetForm('taskform')">重置</el-button>
											</el-form-item>
										</el-form>
									</el-dialog>
								</div>
							</template>
						</el-table-column>
					</el-table>
					<div style="margin-top: 10px">
						<div style="display: block; float: left;margin-left: 5px;">
							<!-- <el-tooltip content="Bottom center" placement="bottom">
								<div slot="content">批量删除</div>
								<i class="el-icon-delete" style="margin: 8px;font-size: 17px;"></i>
							</el-tooltip> -->
						</div>
						<!-- 分页 -->
						<div style="display: block; float: left; margin-left: 24%;">
							<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage4" :pager-count="5"
							 :page-sizes="[4, 6, 10, 20]" :page-size="${page.pageSize}" layout="total, sizes, prev, pager, next, jumper" :total="${page.total}">
							</el-pagination>
						</div>
						<div style="display: block; float: right;margin-right: 3%;">
							<!-- <el-tooltip content="Bottom center" placement="bottom">
								<div slot="content">打印</div>
								<el-button circle size="mini"><i class="el-icon-printer" style="font-size: 17px;"></i></el-button>&nbsp;
							</el-tooltip> -->

							<el-tooltip content="Bottom center" placement="bottom">
								<div slot="content">导出Excel</div>
								<el-button circle size="mini" @click="downloadfile"><i class="el-icon-tickets" style="font-size: 17px;"></i></el-button>
							</el-tooltip>

						</div>
					</div>
				</template>
			</div>
		</div>
		<div id="addjsdiv"></div>
		<script type="text/javascript">
			// 获取所有的待办任务
			var tasktables = ${list};
			var pageinfo = ${pageinfo}
		</script>
		<script type="text/javascript">
		var Main = {
				data() {
					return {
						alltaskoptions: [{
								value: '0',
								label: '全部数据'
							},{
								value: '1427',
								label: '待办任务-已结束'
							}, {
								value: '1428',
								label: '待办任务-未结束'
							}, {
								value: '1429',
								label: '待办任务-取消'
							}],
						alltaskinfor: '',
						tasktheme: ''
					}
				},
				methods:{
					//根据选项获取表单数据
					getSelectInfo(){
							//页大小
						var pageSize= Max.pasSize;
						//查询条件状态
						var statueID=null;
						//待办任务主题
						var search=null;
						//表单对象
						var MainFromnew= MainFrom;
						console.log("搜索数据："+this.alltaskinfor.toString());
						if(this.alltaskinfor.toString()== "0" ){
							window.location.hash='#/aftersale/task';
						}else{
							window.location.hash='#/aftersale/task?statueID='+this.alltaskinfor;
							statueID=this.alltaskinfor;
						}
						this.tasktheme='';
						$.ajax({
								type: "post",
								url: "/aftersale/task",
								data: {pageNum:1,pageSize:pageSize,statueID:statueID,search:search},
								success: function (getPage) {
										console.log("页数："+JSON.stringify(getPage));
										MainFromnew.tasktable=getPage.list;
										MainFromnew.pages=getPage;
										MainFromnew.currentPage4=getPage.pageNum;
								}
						});
					},
						//根据task主题搜索
					searchTheme(){
						//页大小
						var pageSize= Max.pasSize;
						//查询条件状态
						var statueID=null;
						//待办任务主题
						var search=null;
						//表单对象
						var MainFromnew= MainFrom;
						var MainTwoNew=MainTwo;
						console.log(this.alltaskinfor.toString());
						console.log("待办任务主题:"+this.alltaskinfor.toString());
						//判断是否根据条件筛选
						if(this.alltaskinfor.toString()=='0'||this.alltaskinfor.toString()==''){
							if(this.tasktheme==""){
								window.location.hash='#/aftersale/task'
							}
							else{
								window.location.hash='#/aftersale/task?search='+this.tasktheme;
								search=this.tasktheme;
							}
						}else{
							statueID=this.alltaskinfor;
							if(this.tasktheme==""){
								window.location.hash=window.location.hash.split('&')[0];
							}
							else{
								window.location.hash=window.location.hash.split('&')[0]+'&search='+this.tasktheme;
								search=decodeURI(this.tasktheme);
							}
						}
						$.ajax({
								type: "post",
								url: "/aftersale/task",
								data: {pageNum:1,pageSize:pageSize,statueID:statueID,search:search},
								success: function (getPage) {
										console.log("页数："+JSON.stringify(getPage));
										MainFromnew.tasktable=getPage.list;
										MainFromnew.pages=getPage;
										MainTwoNew.getNewPage=getPage;
										MainFromnew.currentPage4=getPage.pageNum;
								}
						});
					},
				},
				mounted:function(){
						var url= window.location.href;
						var url1= url.indexOf("?");
						if(url1!=-1){
							//截取每一个条件
							var urlcondition= url.substring(url1+1,url.length).split('&');
							for(var i=0;i<urlcondition.length;i++){
								
								if(urlcondition[i].split('=')[0]=="statueID"){
									this.alltaskinfor=decodeURI(urlcondition[i].split('=')[1]);
								}
								if(urlcondition[i].split('=')[0]=="search"){
									this.tasktheme=decodeURI(urlcondition[i].split('=')[1]);
								}
							}
						}
				}
			}
			var Ctor = Vue.extend(Main)
			new Ctor().$mount('#app1')


			/*
			 * -----------------------------------------------------------------------------------------------
			 * -----------------------------------------------------------------------------------------------
			 */


			/* 遮罩层 */
			var MainTwo = new Vue({
				el:"#app2",
				data:{
						formLabelWidth: "230px",
						customer:[],
						customers:[],
						allcomcustmanid:[],
						allcomcustmanids:[],
						alltaskcontactid:[],
						alltaskcontactids:[],
						alltaskrepairID:[],
						alltaskrepairIDs:[],
						tclassify:[],
						tclassifys:[],
						domanname:[],
						domannames:[],
						taskform: {
							description: '',
							custID: '',
							contID: '',
							repairID: '',
							taskclassity:'',
							taskdate: new Date(),
							doname: ''
						},
						dialogFormVisible: false,
						cumloading:false,
						dialogDelete:false,
						taskrules: {
							description: [{required: true,message: '必填项',trigger: 'change'}],repairID:[{required: true,message: '必填项',trigger: 'blur'}]
						},
						/* 日期选择 */
						pickerOptions: {
							disabledDate(time) {
								return time.getTime() < Date.now();
							},
							shortcuts: [{
								text: '今天',
								onClick(picker) {
									picker.$emit('pick', new Date());
								}
							}, {
								text: '明天',
								onClick(picker) {
									const date = new Date();
									date.setTime(date.getTime() + 3600 * 1000 * 24);
									picker.$emit('pick', date);
								}
							}, {
								text: '一周后',
								onClick(picker) {
									const date = new Date();
									date.setTime(date.getTime() + 3600 * 1000 * 24 * 7);
									picker.$emit('pick', date);
								}
							}]
						},
				},
				methods: {
					loadAll() {
						return [{
								"value": "三全鲜食（北新泾店）",
								"address": "长宁区新渔路144号"
							},
							{
								"value": "浏阳蒸菜",
								"address": "天山西路430号"
							},
							{
								"value": "红辣椒麻辣烫",
								"address": "上海市长宁区天山西路492号"
							},
							{
								"value": "阳阳麻辣烫",
								"address": "天山西路389号"
							},
						];
					},
					//清除已选内容重选
					 comcustidto(){
						var _this=this;
						_this.customer=_this.customers;
						//清空联系人和维修单
						_this.taskform.contID='';
						_this.taskform.repairID='';
					},
					//获取数据
					getNew(){
						var _this=this;
						this.dialogFormVisible=true;
						axios.post("/aftersale/chooseTaskOptions",
								//参数转换
//								Qs.stringify(this.taskform, {
//									arrayFormat: 'brackets'
//								})
								//id:
								//ajax请求成功的回调函数
							).then(function(v) {
								console.log("回调成功，获取了服务器端返回的值v");
								console.log(v);
								//获取客户
								_this.customers= v.data.comcustid.map(item => {
									return { value: item.ID, label: item.name };
								});
								_this.customer=_this.customers;
								//获取任务分类
								_this.tclassifys= v.data.taskclassity.map(item => {
									return { value: item.dictID, label: item.dictName };
								});
								_this.tclassify=_this.tclassifys;
								//获取任务执行人
								_this.domannames= v.data.doname.map(item => {
									return { value: item.ID, label: item.name };
								});
								_this.domanname=_this.domannames;
								//获取当前登录用户
								console.log("获取当前登录用户"+v.data.user);
								_this.taskform.doname=v.data.user.uId;
								
							})/*.catch(function() {
								alert("出错了");
							})*/;
					},	
					//加载界面客户
					cumremoteMethod(query) {
						var _this=this;
					      if (query !== '') {
					        this.cumloading = true;
					        setTimeout(() => {
					          this.cumloading = false;
					          this.customer = _this.customers.filter(item => {
					            return item.label.toLowerCase()
					              .indexOf(query.toLowerCase()) > -1;
					          });
					        }, 200);
					      } else {
					        this.uosign = [];
					      }
					    },
				   
					//选择客户查询对应的联系人和维修工单
					selectOnechange(){
						 var _this=this;
						 console.log(_this);
						 axios.post("/aftersale/custToconfortask",
						Qs.stringify({
						'custid':_this.taskform.custID,
						'repaireID':_this.taskform.repairID
						}
						,{arrayFormat: 'brackets'})
						).then(function(v){					          				
						console.log("回调成功，获取了服务器端返回的值v");
						console.log(v.data);
						_this.alltaskcontactid= v.data.contID.map(item => {
							return { value: item.ID, label: item.name };
						});
						_this.alltaskrepairID= v.data.repaireID.map(item => {
							return { value: item.ID, label: item.roname };
						}); 
						//_this.orderes
						})/*.catch(function(){
						alert("信息出错了");
						})*/;					
					},
					//加载联系人
					comtaskcontactidMethod(query) {
						var _this=this;
						if (query !== '') {
							this.cumloading = true;
							setTimeout(() => {
								this.cumloading = false;
								this.alltaskcontactid = _this.alltaskcontactids.filter(item => {
									return item.label.toLowerCase()
									.indexOf(query.toLowerCase()) > -1;
								});
							}, 200);
						} else {
							this.uosign = [];
						}
					},
					//加载维修工单
					comrepairIDMethod(query) {
						var _this=this;
						if (query !== '') {
							this.cumloading = true;
							setTimeout(() => {
								this.cumloading = false;
								this.alltaskrepairID = _this.alltaskrepairIDs.filter(item => {
									return item.label.toLowerCase()
									.indexOf(query.toLowerCase()) > -1;
								});
							}, 200);
						} else {
							this.uosign = [];
						}
					},
					//加载任务分类
					taskclassifyMethod(query) {
						var _this=this;
						if (query !== '') {
							this.cumloading = true;
							setTimeout(() => {
								this.cumloading = false;
								this.tclassify = _this.tclassifys.filter(item => {
									return item.label.toLowerCase()
									.indexOf(query.toLowerCase()) > -1;
								});
							}, 200);
						} else {
							this.uosign = [];
						}
					},
					//加载任务执行人
					domannameMethod(query) {
						var _this=this;
						if (query !== '') {
							this.cumloading = true;
							setTimeout(() => {
								this.cumloading = false;
								this.domanname = _this.domannames.filter(item => {
									return item.label.toLowerCase()
									.indexOf(query.toLowerCase()) > -1;
								});
							}, 200);
						} else {
							this.uosign = [];
						}
					},
						
					createStateFilter(queryString) {
						return (state) => {
							return (state.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
						};
					},
					handleSelect(item) {
						console.log(item);
					},
					submitForm(taskform) {
						//验证方法
						//alert("添加！");
						var _this=this;
						console.log("添加："+JSON.stringify(_this.taskform));
						this.$refs[taskform].validate((valid) => {
							if (valid) {
								//post提交数据
								axios.post("/aftersale/addOnetask",
									//参数转换
									Qs.stringify(this.taskform, {
										arrayFormat: 'brackets'
									})
									//id:
									//ajax请求成功的回调函数
								).then(function(v) {
									console.log("回调成功，获取了服务器端返回的值v");
									console.log(v);
									  _this.$message({
					           			showClose: true,
										type: 'success',
										message: '添加成功!',
										duration:3000,
										center: true
									});
					           		//延时两秒刷新
					           		setTimeout(function (){
													_this.dialogFormVisible=false;
					           			showAtRight('/aftersale/task');
					           		}, 2000);
								}).catch(function() {
									//alert("出错了");
									_this.$message({
					           			showClose: true,
										type: 'success',
										message: '添加失败!',
										duration:3000,
										center: true
									});
								});
							} else {
								console.log('error submit!!');
								return false;
							}
						});
					},
					resetForm(formName) {
						this.$refs[formName].resetFields();
					}
				},
				mounted() {
					this.restaurants = this.loadAll();
				},
			})


			/*
			 * -----------------------------------------------------------------------------------------------
			 * -----------------------------------------------------------------------------------------------
			 */


			/*  表单  */
			var MainFrom=new Vue({
				el:"#app3",
				data:{
						tasktable:tasktables,
						customer:[],
						customers:[],
						allcomcustmanid:[],
						allcomcustmanids:[],
						alltaskcontactid:[],
						alltaskcontactids:[],
						alltaskrepairID:[],
						alltaskrepairIDs:[],
						tclassify:[],
						tclassifys:[],
						domanname:[],
						domannames:[],
						allcreateMan:[],
						allcreateMans:[],
						pages: pageinfo,
						currentPage4: pageinfo.pageNum,
						multipleSelection: [],
						formLabelWidth: "230px",
						taskform: {
							description: '',
							custID: '',
							contID: '',
							status: '',
							tasktime:'',
							createdate:'',
							taskclassity:'',
							createMan:'',
							taskdate: '',
							doname: '',
							priority:'',
						},
						dialogFormVisible: false,
						dialogDelete:false,
						cumloading:false,
						taskrules: {
							description: [{required: true,message: '必填项',trigger: 'change'},{required: true,message: '必填项',trigger: 'blur'}]
						},
						/* 日期选择 */
						pickerOptions: {
							disabledDate(time) {
								return time.getTime() < Date.now();
							},
							shortcuts: [{
								text: '今天',
								onClick(picker) {
									picker.$emit('pick', new Date());
								}
							}, {
								text: '明天',
								onClick(picker) {
									const date = new Date();
									date.setTime(date.getTime() + 3600 * 1000 * 24);
									picker.$emit('pick', date);
								}
							}, {
								text: '一周后',
								onClick(picker) {
									const date = new Date();
									date.setTime(date.getTime() + 3600 * 1000 * 24 * 7);
									picker.$emit('pick', date);
								}
							}, {
								text: '一个月后',
								onClick(picker) {
									const date = new Date();
									date.setTime(date.getTime() + 3600 * 1000 * 24 * 30);
									picker.$emit('pick', date);
								}
							}]
						}
				},
				methods: {
					handleClick(row) {
						console.log(row);
					},
					handleSelectionChange(val) {
						this.multipleSelection = val;
					},
					handleSizeChange(val) {
							//页大小
							Max.pasSize= val;
							//查询条件状态
							var statueID=null;
							//待办任务主题
							var search=null;
							var MainFromnew = MainFrom;
							var MainTwoNew=MainTwo;
							//判断是否带条件;
							var url= window.location.href;
							var url1= url.indexOf("?");
							if(url1!=-1){
								//截取条件
								var urlcondition= url.substring(url1+1,url.length).split('&');
								for(var i=0;i<urlcondition.length;i++){
									
									if(urlcondition[i].split('=')[0]=="statueID"){
										statusid=decodeURI(urlcondition[i].split('=')[1]);
									}
									if(urlcondition[i].split('=')[0]=="search"){
										search=decodeURI(urlcondition[i].split('=')[1]);
									}
								}
							}
							$.ajax({
									type: "post",
									url: "/aftersale/task",
									data: {pageNum:1,pageSize:val,statueID:statueID,search:search},
									success: function (getPage) {
											console.log("页数："+JSON.stringify(getPage));
											MainFromnew.tasktable=getPage.list;
											MainFromnew.pages=getPage;
											MainTwoNew.getNewPage=getPage;
											MainFromnew.currentPage4=getPage.pageNum;
									}
							});
					},
					handleCurrentChange(val) {
							//页大小
							var pageSize= Max.pasSize;
							//查询条件状态
							var statueID=null;
							//待办任务主题
							var search=null;
							var MainFromnew = MainFrom;
							//判断是否带条件;
							var url= window.location.href;
							var url1= url.indexOf("?");
							if(url1!=-1){
								//截取条件
								var urlcondition= url.substring(url1+1,url.length).split('&');
								for(var i=0;i<urlcondition.length;i++){
									
									if(urlcondition[i].split('=')[0]=="statueID"){
										statusid=decodeURI(urlcondition[i].split('=')[1]);
									}
									if(urlcondition[i].split('=')[0]=="search"){
										search=decodeURI(urlcondition[i].split('=')[1]);
									}
								}
							}
							$.ajax({
									type: "post",
									url: "/aftersale/task",
									data: {pageNum:1,pageSize:pageSize,statueID:statueID,search:search},
									success: function (getPage) {
											console.log("页数："+JSON.stringify(getPage));
											MainFromnew.tasktable=getPage.list;
											MainFromnew.pages=getPage;
											MainFromnew.currentPage4=getPage.pageNum;
									}
							});
					},
					querySearchAsync(queryString, cb) {
						var restaurants = this.restaurants;
						var results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants;

						clearTimeout(this.timeout);
						this.timeout = setTimeout(() => {
							cb(results);
						}, 3000 * Math.random());
					}, 
					createStateFilter(queryString) {
						return (state) => {
							return (state.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
						};
					},
					handleSelect(item) {
						console.log(item);
					},
					mounted() {
						this.restaurants = this.loadAll();
					},
					//清除已选内容重选
					 comcustidto(){
						var _this=this;
						_this.customer=_this.customers;
						//清空联系人和维修单
						_this.taskform.contID='';
						_this.taskform.repairID='';
					},
					//获取数据
					getNew(){
						var _this=this;
						this.dialogFormVisible=true;
						axios.post("/aftersale/chooseTaskOptions",
								//参数转换
//								Qs.stringify(this.taskform, {
//									arrayFormat: 'brackets'
//								})
								//id:
								//ajax请求成功的回调函数
							).then(function(v) {
								console.log("回调成功，获取了服务器端返回的值v");
								console.log(v);
								//获取客户
								_this.customers= v.data.comcustid.map(item => {
									return { value: item.ID, label: item.name };
								});
								_this.customer=_this.customers;
								//获取任务分类
								_this.tclassifys= v.data.taskclassity.map(item => {
									return { value: item.dictID, label: item.dictName };
								});
								_this.tclassify=_this.tclassifys;
								//获取任务执行人
								_this.domannames= v.data.doname.map(item => {
									return { value: item.ID, label: item.name };
								});
								_this.domanname=_this.domannames;
								
							})/*.catch(function() {
								alert("出错了");
							})*/;
					},	
					//更新页面数据
					updatehandleClick(row) {
						var _this = this;
						var id= row;
						console.log(_this);
						axios.post("/aftersale/selectOnetask",
							Qs.stringify( {
						   			'ID':row.ID,
							   },{arrayFormat: 'brackets'}) 
							
							//ajax请求成功的回调函数
						).then(function(v) {
							console.log("回调成功，获取了服务器端返回的值v");
							console.log(v.data);
							//获取客户
							_this.customers= v.data.comcust.map(item => {
								return { value: item.ID, label: item.name };
							});
							_this.customer=_this.customers;
							//获取任务分类
							_this.tclassifys= v.data.taskclassity.map(item => {
								return { value: item.dictID, label: item.dictName };
							});
							_this.tclassify=_this.tclassifys;
							//获取任务执行人
							_this.domannames= v.data.doname.map(item => {
								return { value: item.ID, label: item.name };
							});
							_this.domanname=_this.domannames;
							//获取创建人
							_this.allcreateMans=v.data.doname.map(item => {
								return { value: item.ID, label: item.name };
							});
							_this.allcreateMan=_this.allcreateMans;
							//获取联系人
							_this.alltaskcontactids= v.data.contact.map(item => {
								return { value: item.ID, label: item.name };
							});
							_this.alltaskcontactid=_this.alltaskcontactids;
							/*//获取维修工单
							_this.alltaskrepairIDs= v.data.repire.map(item => {
								return { value: item.ID, label: item.name };
							});
							_this.alltaskrepairID=_this.alltaskrepairIDs; 	*/			
							//传值
							console.log("更新onetask:"+v.data);
							console.log(v.data.onetask);
							_this.taskform.ID=v.data.onetask.ID;
							_this.taskform.description=v.data.onetask.description;
							_this.taskform.custID=v.data.onetask.custid;
							_this.taskform.contID=v.data.onetask.conid;
							_this.taskform.status=v.data.onetask.status;
							_this.taskform.tasktime=v.data.onetask.tasktime;
							_this.taskform.taskdate=v.data.onetask.taskdate;
							_this.taskform.createdate=v.data.onetask.createDate;
							_this.taskform.createMan=v.data.onetask.createMan;
							_this.taskform.taskclassity=v.data.onetask.classity;
							_this.taskform.doname=v.data.onetask.manID;
							_this.taskform.priority=v.data.onetask.priority;
							
						})/* .catch(function() {
							alert("出错了");
						} )*/;
						//this.selectOnechange();
						this.dialogFormVisible = true;
					},
					//加载界面客户
					cumremoteMethod(query) {
						var _this=this;
					      if (query !== '') {
					        this.cumloading = true;
					        setTimeout(() => {
					          this.cumloading = false;
					          this.customer = _this.customers.filter(item => {
					            return item.label.toLowerCase()
					              .indexOf(query.toLowerCase()) > -1;
					          });
					        }, 200);
					      } else {
					        this.uosign = [];
					      }
					    },
				   
					//选择客户查询对应的联系人和维修工单
					selectOnechange(){
						 var _this=this;
						 console.log(_this);
						 axios.post("/aftersale/custToconfortask",
						Qs.stringify({
						'custid':_this.taskform.custID,
						'repaireID':_this.taskform.repairID
						}
						,{arrayFormat: 'brackets'})
						).then(function(v){					          				
						console.log("回调成功，获取了服务器端返回的值v");
						console.log(v.data);
						_this.alltaskcontactid= v.data.contID.map(item => {
							return { value: item.ID, label: item.name };
						});
						_this.alltaskrepairID= v.data.repaireID.map(item => {
							return { value: item.ID, label: item.roname };
						}); 
						//_this.orderes
						})/*.catch(function(){
						alert("信息出错了");
						})*/;					
					},
					//加载联系人
					comtaskcontactidMethod(query) {
						var _this=this;
						if (query !== '') {
							this.cumloading = true;
							setTimeout(() => {
								this.cumloading = false;
								this.alltaskcontactid = _this.alltaskcontactids.filter(item => {
									return item.label.toLowerCase()
									.indexOf(query.toLowerCase()) > -1;
								});
							}, 200);
						} else {
							this.uosign = [];
						}
					},
					//加载维修工单
					comrepairIDMethod(query) {
						var _this=this;
						if (query !== '') {
							this.cumloading = true;
							setTimeout(() => {
								this.cumloading = false;
								this.alltaskrepairID = _this.alltaskrepairIDs.filter(item => {
									return item.label.toLowerCase()
									.indexOf(query.toLowerCase()) > -1;
								});
							}, 200);
						} else {
							this.uosign = [];
						}
					},
					//加载任务分类
					taskclassifyMethod(query) {
						var _this=this;
						if (query !== '') {
							this.cumloading = true;
							setTimeout(() => {
								this.cumloading = false;
								this.tclassify = _this.tclassifys.filter(item => {
									return item.label.toLowerCase()
									.indexOf(query.toLowerCase()) > -1;
								});
							}, 200);
						} else {
							this.uosign = [];
						}
					},
					//加载任务执行人
					domannameMethod(query) {
						var _this=this;
						if (query !== '') {
							this.cumloading = true;
							setTimeout(() => {
								this.cumloading = false;
								this.domanname = _this.domannames.filter(item => {
									return item.label.toLowerCase()
									.indexOf(query.toLowerCase()) > -1;
								});
							}, 200);
						} else {
							this.uosign = [];
						}
					},
					//加载创建人
					createManMethod(query){
						var _this=this;
						if (query !== '') {
							this.cumloading = true;
							setTimeout(() => {
								this.cumloading = false;
								this.allcreateMan = _this.allcreateMans.filter(item => {
									return item.label.toLowerCase()
									.indexOf(query.toLowerCase()) > -1;
								});
							}, 200);
						} else {
							this.uosign = [];
						}
					},
					//提交表单
					submitForm(taskform) {
						//验证方法
						//alert("修改！");
						var _this=this;
						this.$refs[taskform].validate((valid) => {
							if (valid) {
								//post提交数据
								axios.post("/aftersale/updateOnetask",
									//参数转换
									Qs.stringify(this.taskform, {
										arrayFormat: 'brackets'
									})
									//id:
									//ajax请求成功的回调函数
								).then(function(v) {
									console.log("回调成功，获取了服务器端返回的值v");
									console.log(v);
									  _this.$message({
					           			showClose: true,
										type: 'success',
										message: '修改成功!',
										duration:3000,
										center: true
									});
					           		//延时两秒刷新
					           		setTimeout(function (){
													_this.dialogFormVisible=false;
					           			showAtRight('/aftersale/task');
					           		}, 2000);
								}).catch(function() {
									//alert("出错了");
									_this.$message({
					           			showClose: true,
										type: 'success',
										message: '修改失败!',
										duration:3000,
										center: true
									});
								});
							} else {
								console.log('error submit!!');
								return false;
							}
						});
					},
					resetForm(formName) {
						this.$refs[formName].resetFields();
					},
					
					deletenew(ID){
						this.ID=ID;
						this.dialogDelete=true;
					},
					//删除方法
					Delete(){
						var _this=this;
						axios.get("/aftersale/deleteonetask",
			           			//参数转换
			           			//Qs.stringify(this.form,{arrayFormat: 'brackets'})
			           			//ajax请求成功的回调函数
			           			{
									params:{
										ID :_this.ID
									}
			           			}
			          			).then(function(response){					          				
			           			console.log("回调成功，获取了服务器端返回的值v");
			           			console.log(response.data);					           		
			           		_this.restaurants=response.data;
										if(response.data.status==1428) {
													_this.$message({
			               			showClose: true,
													type: 'error',
													message: '任务未结束!删除失败!',
													duration:3000,
													center: true
												});
										}else{
											_this.$message({
												showClose: true,
											type: 'success',
											message: '删除成功!',
											duration:3000,
											center: true
										});
											//延时两秒刷新
											setTimeout(function (){
												showAtRight('/aftersale/task');
											}, 2000);
										}
											}).catch(function(){
												//alert("删除失败！");
												_this.$message({
												type: 'error',
												message: '删除失败!',
												duration:3000,
												center: true
											});
											});	//这个是数据的初始化
									},
						
				    //导出Excel
				      downloadfile(){
				    	  window.location.href ="/aftersale/taskExcelDownloads";
				      }
				}
			})
		</script>
	</body>
</html>
